<template>
  <el-form-item label="购买起止时间："
    prop="buyTimes"
    v-if="editorValue && editorValue.length"
    :rules="[
      { required: !0, message: '请选择购买起止时间'}
    ]">
    <ticket-time-item
      v-for="(item, index) in editorValue"
      :value="item"
      :index="index"
      :key="item.name"
      @change="handleTimesChange"/>
  </el-form-item>
</template>
<script>
  import TicketTimeItem from './TicketTimeItem'
  export default {
    components: {
      TicketTimeItem
    },
    props: {
      value: {
        type: Array,
        default: []
      }
    },
    computed: {
      editorValue () {
        return this.value
      }
    },
    data () {
      return {}
    },
    methods: {
      handleTimesChange (index, newVal) {
        let timeArr = newVal.split(' - ')
        let newResult = this.editorValue
        newResult[index].times = timeArr
        newResult[index].startBuyTime = Date.parse(timeArr[0]) || ''
        newResult[index].endBuyTime = Date.parse(timeArr[1]) || ''
        this.$emit('input', newResult)
          .$emit('change', newResult)
      }
    }
  }
</script>
